<script setup>

import useUserStore from '@/store/modules/user'
import {listAll} from "@/api/system/user.js";

const props = defineProps({
  disabled: {
    type: Boolean,
    default: false
  },
  /**当前双向数据绑定的值 */
  value: {
    type: [String, Number],
    default: ''
  },
  name: {
    type: String,
    default: ''
  }
});

const emit = defineEmits(['update:value']);

const userStore = useUserStore()
const userList = ref(userStore.getUserList());

if (!userList.value.length) {
  listAll().then((response)=>{
    userStore.setUserList(response)
    userList.value = userStore.getUserList();
  })
}

function getName(val) {
  const one = userList.value.find(item => item.userId === val);
  if (one) {
    return one.nickName;
  }
  return null;
}

const valueId = computed({
  get: () => props.value,
  set: (val) => {
    emit('update:value', val)
    const name = getName(val);
    emit('update:name', name)
  }
});

</script>

<template>
  <el-select :disabled="disabled" v-model="valueId" style="width: 100%;">
    <el-option v-for="u in userList" :key="u.userId" :label="u.nickName" :value="u.userId"></el-option>
  </el-select>
</template>

<style scoped lang="scss">

</style>